import React, { PureComponent } from 'react';
import { connect } from 'dva';
import {
  Table, Button, Card, Radio, Modal,Icon,Row,Col,Divider,message
} from 'antd';
import PageHeaderLayout from '../../layouts/PageHeaderLayout';
import styles from './style.less';
import moment from 'moment';
import docCookies from "../../common/DocCookies";

@connect(state => ({
  contentManager: state.contentManager,
}))
export default class ContentList extends PureComponent {
  state = {
    pageNo:1,
    pageSize:10,
    total:0,
    rsId:docCookies.getItem("rsId"),

    spreadListData:[]
  };

  ////初始化渲染后触发 整个过程只调用一次
  componentDidMount() {
    this.loadCouponInfo();
  }

  loadCouponInfo(){
    const { dispatch } = this.props;
    const pageNo = this.state.pageNo ;
    const pageSize = this.state.pageSize ;
    // 需要传递的参数信息
    const params = {
      rsId:this.state.rsId,
      pageNo: pageNo,
      pageSize: pageSize,
    };
    dispatch({
      type: 'contentManager/fetchListSpreadResult',  //请求的action
      payload:params,
      callback:(data) =>{
        this.setState({
          spreadListData: data.list,
          pageNo:data.pageNo,
          pageSize:data.pageSize,
          total:data.total,
        });
      }
    });

  }
  openAddNewSpreadContent(){
    const { dispatch} = this.props;
    dispatch({
      type: 'contentManager/contentAddForm',
    });
  }

  editSpreadContent (record){
    const { dispatch} = this.props;
    const param = {
      id:record.id
    }
    dispatch({
      type: 'contentManager/contentAddForm',
      payload:param
    });
  }

  delSpreadContentInfo (id){
    var self = this;
    const { dispatch } = this.props;
    const params = {
      id:id
    };

    Modal.confirm({
      title: '提示',
      content: '您确定删除该活动吗？',
      okText: '确认',
      cancelText: '取消',
      onOk: () => {
        dispatch({
          type: 'contentManager/fetchDelSpreadContent',  //请求的action
          payload: params,
          callback: (response) => {
            if(response.errorCode != 0){
              self.loadCouponInfo()
            }
            message.success(response.msg)
          }
        });
      }
    })
  }



  handleTableChange = (page, pageSize) => {
    this.state.pageNo = page;
    this.setState({
      pageNo:page,
      pageSize:pageSize
    });
    this.loadCouponInfo();
  }

  render() {
    const { pageSize ,total,pageNo } = this.state;

    const columns = [{
      title: '内容标题',
      dataIndex: 'activityTitle',
    },{
      title: '操作',
      render: (text, record) => (
        <span>
          <a href="javascript:void(0)" onClick={() => this.editSpreadContent(record)} >编辑</a>
          <Divider type="vertical" />
          <a href="javascript:void(0)" onClick={() => this.delSpreadContentInfo(record.id)} >删除</a>
        </span>
      ),
    }];

    const paginationProps = {
      pageSize:pageSize,
      total:total,
      current:pageNo,
      onChange:this.handleTableChange
    };

    return (
          <Card title="活动列表" extra={<Button type="primary" icon="plus" style={{ float:'right' }} onClick={() => this.openAddNewSpreadContent()}>添加</Button>}>
            <Row gutter={16}>
              <Col className="gutter-row" span={24}>
                <Table dataSource={this.state.spreadListData} columns={columns} style={{ width: '100%' }}
                       pagination={paginationProps} rowKey="id"  />
              </Col>
            </Row>
          </Card>
    );
  }
}
